<style>
    .web-icon {
        /*background: url(../../yasuotu/images/cexuanfu.png) no-repeat*/
        background: url({{asset('/vendor/dcat-admin/images/kefu_float.png')}}) no-repeat;
    }
    .serve-kefu {
        width: 70px;
        position: fixed;
        right: 0px;
        top: 265px;
        z-index: 1050;
        box-sizing: content-box;
    }

    .ml_50 {
        margin-left: 0px;
        padding: 0px;
    }

    .serve-kefu ul .web-icon:hover {
        cursor: pointer
    }

    .serve-kefu ul .web-icon {
        display: block;
        width: 68px;
        height: 78px;
        transition: all .3s;
        position: relative;
        border: 1px solid #f1f1f1;
    }

    .footer,.serve-kefu ul .kefu-back-icon,.link {
        display: none;
    }
    .serve-kefu .kefu-wx-icon {
        background-position: 0 0
    }

    .serve-kefu .kefu-qq-icon {
        background-position: 0 -78px
    }
    .serve-kefu .kefu-help-icon {
        background-position: 0 -156px
    }
    .serve-kefu .kefu-help-icon a{
        width: 100%;
        height: 100%;
        display: inline-block;
    }
    .serve-kefu .kefu-question-icon {
        background-position: 0 -236px;
    }
    .serve-kefu .kefu-question-icon a{
        width: 100%;
        height: 100%;
        display: inline-block;
    }
    .serve-kefu .kefu-wenjuan-icon{
        background-position: 0 -156px
    }
    .serve-kefu .kefu-messageBoard-icon{
        background-position: 0 -236px
    }
    .serve-kefu .kefu-back-icon {
        /*background-position: 0 -313px*/
        background-position: 0 -236px
    }


    .serve-kefu ul .kefu-wx-icon:hover {
        background-position: -68px 0
    }

    .serve-kefu ul .kefu-qq-icon:hover {
        background-position: -68px -78px;
    }
    .serve-kefu .kefu-help-icon:hover {
        background-position: -68px -156px;
    }
    .serve-kefu .kefu-question-icon:hover {
        background-position: -68px -236px;
    }
    .serve-kefu .kefu-wenjuan-icon:hover{
        background-position: -68px -156px
    }
    .serve-kefu .kefu-messageBoard-icon:hover{
        background-position: -68px -236px
    }
    .serve-kefu ul .kefu-back-icon:hover {
        /*background-position: -68px -313px;*/
        background-position: -68px -236px
    }

    .gzh_wrap {
        bottom: auto !important;
    }
    .kf_wrap{
        position: absolute;
        padding-right: 8px;
        left: 95px;
        border-radius: 5px;
        bottom: -237px;
    }


    .serve-kefu ul li:hover .kf_wrap {
        left: -200px !important
    }

    .kefu-qq{
        width: 192px;
        height: auto;
        top: 0;
        color: #333;
        font-size: 13px;
        background: #fff;
        box-shadow: 0 0 10px #daf1f8;
    }
    .kefu-qq>p{
        width: 100%;
        height: 45px;
        line-height: 45px;
        text-align: center;
        border-bottom: 1px solid #f1f1f1;
        color: #000;
        font-weight: bold;
        font-size: 14px;
    }
    .kefu-qq ul{
        padding: 10px;
    }
    .kefu-qq ul div{
        display: flex;
        position: relative;
        padding-left: 30px;
        margin-bottom: 10px;
        white-space: nowrap;
        font-size: 12px;
    }
    .kefu-qq ul div.kftitle{
        font-size: 14px;
        color: #000;
        font-weight: bold;
    }
    .kfBtn{
        display: block;
        width: 86px;
        height: 27px;
        text-align: center;
        line-height: 27px;
        /*background: #25aad6;*/
        background: #0084e9;
        color: #fff;
    }
    a.kfBtn:hover{
        color: #fff;
    }
    .kefu-wx {
        width: 192px;
        height: 232px;
        padding: 20px;
        top: 0;
        color: #333;
        text-align: center;
        font-size: 13px;
        background: #fff;
        box-shadow: 0 0 10px #daf1f8;
        box-sizing: border-box;
    }


    .kefu-wx img {
        padding: 5px;
        display: block;
        width: 148px;
        height: 148px;
        box-sizing: content-box;
    }

    .qkfIcon{
        position: absolute;
        left: 0;
        width: 23px;
        height: 18px;
        background: url() no-repeat;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }
    .wxkfIcon{
        position: absolute;
        left: 0;
        width: 22px;
        height: 18px;
        background: url() no-repeat;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }
    .phoneIcon{
        position: absolute;
        left: 0;
        width: 15px;
        height: 18px;
        background: url() no-repeat;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }
</style>
{{--https://www.yasuotu.com/--}}
<div class="serve-kefu">
    <div class="newYearvip_wrap">

    </div>
    <ul class="ml_50">
        <li class="web-icon kefu-wx-icon">
            <div class="kf_wrap gzh_wrap">
                <div class="kefu-wx wxkf_ewm">
                    <img src="/vendor/dcat-admin/images/wxgzh_qrcode.jpg" alt="">
                    <p>扫描二维码关注</p>
                    <p>了解更多极速开发</p>
                </div>
            </div>
        </li>
        <li class="web-icon kefu-qq-icon">
            <div class="kf_wrap">
                <div class="kefu-qq">
                    <p>咨询客服</p>
                    <ul>
                        <div class="kftitle"><i class="qkfIcon"></i>
                            <p>QQ客服咨询</p>
                        </div>
                        <div>客服QQ: 3664839</div>
                        <div><a href="http://wpa.qq.com/msgrd?v=3&amp;uin=3664839&amp;site=qq&amp;menu=yes" target="_blank" class="kfBtn">联系客服</a></div>
                        <div class="kftitle"><i class="wxkfIcon"></i>
                            <p>微信客服咨询</p>
                        </div>
                        <div>
                            <img src="/vendor/dcat-admin/images/wx-qrcode.jpeg" alt="" style="width: 96px;height: 96px">
                        </div>
                        <div class="kftitle"><i class="phoneIcon"></i>
                            <p>联系电话</p>
                        </div>
                        <div>微信号: Q3664839</div>
                        <div>周一至周六08:30 - 17:00</div>
                    </ul>
                </div>
            </div>
        </li>
        <li class="web-icon kefu-help-icon">
            <a href="https://www.dcat-admin.com/books/dcatplus-admin/#/" target="_blank"></a>
        </li>
        <li class="web-icon kefu-question-icon">
            <a href="https://forum.saishiyun.net/d/55-dcat-admin-de-wen-juan-diao-cha-qi-dai-ni-de-can-ru" target="_blank"></a>
        </li>
        <li class="web-icon kefu-back-icon" onclick="$(&quot;html,body&quot;).animate({&quot;scrollTop&quot;:0});" style="display: none;"> </li>
    </ul>
</div>